<template>
  <div>
    <div class="title">
      <van-icon name="arrow-left" @click="$router.go(-1)"/>
      <span>我的收货地址</span>
    </div>
    <van-address-list
        :switchable="false"
        v-model="chosenAddressId"
        :list="list"
        default-tag-text="默认"
        @edit="onEdit"
        @add="onAdd('additionadd')"
    />
  </div>
</template>

<script>
import { areaList } from '@vant/area-data';

export default {
  name: "Address",
  data() {
    return {
      areaList,
      chosenAddressId: '1',
      list: [
        {
          id: '1',
          name: '张三',
          tel: '13000000000',
          address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
          isDefault: true,
        }
      ],
    }
  },
  methods: {
    onEdit(item, index) {
      // console.log(item)
      // console.log(this.areaList)
      let code = 0
      for (let k in this.areaList.county_list) {
          if (this.areaList.county_list[k] === item.county) {
            // console.log(k)
            code = k
            this.$router.push({name: 'updateaddress',
              query: {
                list: item,
                code: code
              }
            })
            return
          }
      }
    },
    onAdd(name) {
      this.$toPage(name)
    }
  },
  async created() {
    const address = await this.$get('address/list')
    for (let i = 0; i < address.data.data.list.length; i++) {
      address.data.data.list[i].address = address.data.data.list[i].province + ' ' + address.data.data.list[i].city + ' ' + address.data.data.list[i].county + ' ' + address.data.data.list[i].addressDetail
    }
    console.log(address.data.data.list)
    this.list = address.data.data.list

    // for (let i=0;i<this.areaList.province_list;i++) {
    //   console.log(i)
    // }

  }
}
</script>

<style lang="less" scoped>
.title {
  position: relative;
  width: 375px;
  height: 45px;
  line-height: 45px;
  font-size: 18px;
  text-align: center;

  .van-icon-arrow-left {
    position: absolute;
    left: 0px;
    line-height: 45px;
    margin-left: 11px;
    font-size: 18px;
  }
}

.address-box {
  width: 375px;
  height: 95px;

  .user-box {
    margin-left: 19px;
    margin-top: 22px;
    line-height: 19px;
    display: flex;
    flex-direction: row;
    font-size: 14px;
    font-weight: 600;

    .name {
      margin-right: 18px;
    }

    .default {
      margin-left: 9px;
      width: 35px;
      height: 20px;
      line-height: 20px;
      font-size: 12px;
      font-weight: normal;
      background-color: #F6390D;
      color: #fff;
      text-align: center;
    }
  }

  .address {
    margin-left: 19px;
    margin-top: 11px;
    font-size: 14px;
    color: #909090;
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    :first-child {
      margin-right: 67px;
    }

    .van-icon-edit {
      margin-right: 24px;
      font-size: 20px;
    }
  }
}

.van-button--danger {
  position: fixed;
  bottom: 12px;
  width: 349px;
  height: 40px;
  border-radius: 100px;
  background-color: #F6390D;
}
</style>
